<template>
    <div>
        这是个动物园
        <ul>
            <router-link tag="li" to="/monkey">猴子</router-link>
            <router-link tag="li" to="/bm">斑马</router-link>
            <router-link tag="li" to="/panda">熊猫</router-link>
            <router-link tag="li" to="/tiger">老虎</router-link>
            <router-link tag="li" to="/ticket">去买票</router-link>
        </ul>
        <router-view></router-view>
    </div>
</template>

<script>
export default {
  name: '',
  data() { 
    return {

    }
  },
  created() {

  },
  methods:{

  },
 }
</script>

<style scoped>
ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
  }
  li{
    padding: 5px 15px;
  }
  .active{
    background-color: blue;
    color: #fff;
  }
</style>